<template>
	<view v-if="bodyShow">
		<!-- 没有企业id展示信息 -->
		<view v-if="!qiyeId">
			<view class="uni-margin-wrap">
				<swiper class="swiper" circular :indicator-dots="indicatorDots" :autoplay="autoplay"
					:interval="interval" :duration="duration">
					<swiper-item v-for="(item,index) in swiperlist" :key="index">
						<view class="swiper-item uni-bg-red">
							<image :src="imgHost+item.img" mode=""></image>
						</view>
					</swiper-item>
				</swiper>
			</view>
			<view class="xianq">
				<div class="xinqtext">
					<h3>公司介绍</h3>
					<span>COMPANY</span>
				</div>
				<div class="lintext">
					<div class="poimg">
						<image :src="imgHost+'/web-view/jiajia.png'" mode=""></image>
					</div>
					<span>
						河南众邦科技有限公司，秉持“以壹为始，立壹之
						上”的企业发展理念，从壹出发，不忘初心，潜心打
						造产品、打造值得用户信赖的产品，提供体系完善的
						品质服务，连续多年稳健运营，久经市场重重考验，
						业务丰富，为全行业企业信息化做持久贡献，成熟的
						运营模式让企业拥有全球多个城市的合作商;公司专注
						于互联网技术研发，是一家集软件定制、开发、服务
						于一体的个性化软件系统研发企业。
					</span>
				</div>
			</view>
			<!-- 推荐热文 -->
			<div class="remeng" v-if="qiyeArticle.length > 0">
				<p>推荐文章</p>
				<view v-for="(item,index) in qiyeArticle" :key="index" @click="rewtiaoz(item)">
					<view class="left">
						<image :src="item.image_input"></image>
					</view>
					<view class="right">
						<view class="title">{{item.title}}</view>
						<view class="msg">{{item.synopsis}}</view>
						<view class="tiem">
							<text>{{item.create_time}}</text>
							<text>{{item.visit ? item.visit : 0 }}次阅读量</text>
						</view>
					</view>
				</view>
			</div>
			<!-- 联系我们 -->
			<div class="gywm">
				<div class="xinqtext">
					<h3>联系我们</h3>
					<span>ABOUT</span>
				</div>
				<div class="ophone">
					<span>联系电话</span>
					<div class="phflex">
						<span>{{aboutInfo.company_tel}}</span>
						<div>
							<image :src="imgHost+'/web-view/phone.png'" mode="" @click="callTel"></image>
						</div>
					</div>
				</div>
				<div class="ophone">
					<span>公司地址</span>
					<div class="phflex">
						<span>{{aboutInfo.company_address}}</span>
						<div>
							<image :src="imgHost+'/web-view/dingwei.png'" mode=""></image>
						</div>
					</div>
				</div>
				<span class="dibu">- 到底了，看看其他的吧 -</span>
			</div>
		</view>
		<block v-else>
			<!-- 企业介绍 -->
			<view>
				<view class="uni-margin-wrap">
					<swiper class="swiper" circular :indicator-dots="indicatorDots" :autoplay="autoplay"
						:interval="interval" :duration="duration">
						<swiper-item v-for="(item,index) in qiyeBannerList" :key="index">
							<view class="swiper-item uni-bg-red">
								<image :src="item" mode=""></image>
							</view>
						</swiper-item>
					</swiper>
				</view>
				<view class="xianq">
					<div class="xinqtext">
						<h3>公司介绍</h3>
						<span>COMPANY</span>
					</div>
					<div class="lintext">
						<div class="poimg">
							<image :src="qiyeDetailImgList" mode=""></image>
						</div>
						<span>
							{{ qiyeMsg ? qiyeMsg : '' }}
						</span>
					</div>
				</view>
				<!-- 推荐文章 -->
				<div class="remeng" v-if="qiyeArticle.length > 0">
					<p>推荐文章</p>
					<view v-for="(item,index) in qiyeArticle" :key="index" @click="rewtiaoz(item)" v-if="index<3">
						<view class="left">
							<image :src="item.image_input"></image>
						</view>
						<view class="right">
							<view class="title">{{item.title}}</view>
							<view class="msg">{{item.synopsis}}</view>
							<view class="tiem">
								<text>{{item.create_time}}</text>
								<text>{{item.visit ? item.visit : 0 }}次阅读量</text>
							</view>
						</view>
					</view>
				</div>
				<!-- 联系我们 -->
				<div class="gywm">
					<div class="xinqtext">
						<h3>联系我们</h3>
						<span>ABOUT</span>
					</div>
					<div class="ophone">
						<span>联系电话</span>
						<div class="phflex">
							<span>{{aboutInfo.company_tel}}</span>
							<div>
								<image :src="imgHost+'/web-view/phone.png'" mode="" @click="callTel"></image>
							</div>
						</div>
					</div>
					<div class="ophone">
						<span>公司地址</span>
						<div class="phflex" @click="openMap()">
							<span>{{aboutInfo.address}}</span>
							<div>
								<image :src="imgHost+'/web-view/dingwei.png'" mode=""></image>
							</div>
						</div>
					</div>
					<span class="dibu">- 到底了，看看其他的吧 -</span>
				</div>
			</view>
		</block>
		<view class="foot" v-if="false">
			<view class="page-footer" id="target" :style="{'background-color':newData.bgColor.color[0].item}">
				<view class="foot-item" v-for="(item,index) in newData.menuList" :key="index" @click="goRouter(item)">
					<block v-if="item.link == activeRouter">
						<image :src="item.imgList[0]"></image>
						<view class="txt" :style="{color:newData.activeTxtColor.color[0].item}">{{item.name}}
						</view>
					</block>
					<block v-else>
						<image :src="item.imgList[1]"></image>
						<view class="txt" :style="{color:newData.txtColor.color[0].item}">{{item.name}}</view>
					</block>
					<div class="count-num" v-if="item.link === '/pages/order_addcart/order_addcart' && cartNum > 0">
						{{cartNum}}
					</div>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getNavigation,
		getShareTitle
	} from '@/api/public.js'
	import {
		HTTP_REQUEST_URL
	} from '@/config/app.js';
	import {
		carduser,
		getQiyeVideo,
		delQiyeVideo,
		deitQiyeMsg,
		getQiyeDetail,
		getAbout,
		deitAbout
	} from "@/api/userminp.js"
	import {
		getArticleMerList
	} from '@/api/api.js'
	import {
		mapGetters
	} from "vuex";
	import {
		configMap
	} from '@/utils';
	export default {
		data() {
			return {
				bodyShow: false,
				// 企业轮播图
				qiyeBannerList: [],
				// 企业简历图
				qiyeDetailImgList: "",
				// 企业简介文字
				qiyeMsg: "",
				// 企业id
				qiyeId: null,
				// 关于我们信息
				aboutInfo: {
					company_tel: "0371-66566999",
					company_address: "中国河南省郑州市管城区启航大厦E座10层1012室",
					address: "中国河南省郑州市管城区启航大厦E座10层1012室",
				},
				// 企业视频列表
				qiyeVideoList: [],
				// 企业文章
				qiyeArticle: [],
				swiperlist: [{
						img: '/web-view/lbt.png'
					},
					{
						img: '/web-view/lbt.png'
					},
					{
						img: '/web-view/lbt.png'
					}
				],
				newData: {},
				indicatorDots: true,
				autoplay: true,
				interval: 2000,
				duration: 500,
				showindex: '0',
				activeRouter: '',
				imgHost: HTTP_REQUEST_URL + '/mingpian',
				list: [{
						img: '/web-view/fenzhi.png',
						oimg: "/web-view/fenzhihong.png",
						name: '企业介绍'
					},
					{
						img: '/web-view/shu.png',
						oimg: "/web-view/shuhong.png",
						name: '产品介绍'
					},
					{
						img: '/web-view/bofan.png',
						oimg: "/web-view/bofanhong.png",
						name: '企业视频'
					},
					{
						img: '/web-view/liaotian.png',
						oimg: "/web-view/liaotianhong.png",
						name: '关于我们'
					},
				],
				merId: 0,
				// 小程序分享标题
				share_title: ""
			};
		},
		computed: configMap(
			mapGetters(['isLogin', 'viewColor', 'keyColor'])
		),
		onLoad(e) {
			if (!uni.getStorageSync("QIYEID") && e.id == undefined) {
				uni.redirectTo({
					url: '/pages/webview/webview'
				})
				return false
			}
			if(e.id) this.qiyeId = e.id || 0
			this.bodyShow = true
			uni.hideTabBar()
			let that = this;
			if (uni.getStorageSync('FOOTER_BAR')) {
				uni.hideTabBar()
			}
			getNavigation().then(res => {
				this.newData = res.data
				if (this.newData.status && this.newData.status.status) {
					uni.hideTabBar()
				} else {
					uni.showTabBar()
				}
			})
			let routes = getCurrentPages(); // 获取当前打开过的页面路由数组
			let curRoute = routes[routes.length - 1].route //获取当前页面路由
			this.activeRouter = '/' + curRoute
		},
		onShow() {
			// 企业id
			if (uni.getStorageSync("QIYEID")) {
				this.bodyShow = true
				this.qiyeId = uni.getStorageSync("QIYEID")
				this.merId = uni.getStorageSync("merId")
				console.log("有内容", this.qiyeId)
				// 获取企业介绍
				getQiyeDetail({
					enterprise_id: this.qiyeId
				}).then(res => {
					if (res.data.company_images) {
						this.qiyeBannerList = res.data.company_images
					}
					if (res.data.compang_banner) {
						this.qiyeDetailImgList = res.data.compang_banner
					}
					this.qiyeMsg = res.data.company_des
				})
				// 获取关于我们
				getAbout({
					enterprise_id: this.qiyeId
				}).then(res => {
					if (res.status == 200) {
						this.aboutInfo = res.data
						this.qiyeArticle = res.data.article_list
					}
				})
				console.log(this.qiyeId, "this.qiyeId")
				// 获取文章
				// getArticleMerList(this.merId).then(res=>{
				// 	this.qiyeArticle=res.data.list
				// })
			} else {
				console.log("没有内容")
				this.qiyeId = 0
				// 获取文章
				getArticleMerList(this.merId).then(res => {
					this.qiyeArticle = res.data.list
				})
			}
			getShareTitle({
				field: "websiteShareTitle"
			}).then(res => {
				this.share_title = res.data.websiteShareTitle
			})
		},
		onShareAppMessage(e) {
			return { // 自定义分享内容
				title: this.share_title,
				path: `/pages/webview/websub/websub` // 路径，可传递参数到指定页面
			}
		},
		onShareTimeline() {
			return {
				title: this.share_title,
				path: `/pages/webview/websub/websub`
			};
		},
		methods: {
			openMap(){
				uni.openLocation({
					latitude: parseFloat(this.aboutInfo.lat),
					longitude: parseFloat(this.aboutInfo.long),
					name: this.aboutInfo.address,
					success: (e) => {}
				})
			},
			// 点击跳转推荐热文
			rewtiaoz(item) {
				console.log(item, "推销热文id")
				uni.navigateTo({
					url: '/pages/news_details/index?id=' + item.article_id
				})
			},
			// 选择公司地址
			chooseAddress() {
				uni.chooseLocation({
					success: (res) => {
						this.aboutInfo.company_address = res.address
						this.aboutInfo.address = res.address
					}
				})
			},
			// 拨打电话
			callTel() {
				uni.makePhoneCall({
					phoneNumber: this.aboutInfo.company_tel
				});
			},
			// 上传企业banner图
			addBannerImg() {
				let that = this;
				that.$util.uploadImageChange('upload/image', (res) => {
					if (res.status == 200) {
						console.log(that.qiyeBannerList);
						console.log(11111111111);
						that.qiyeBannerList.push(res.data.url)
						console.log(that.qiyeBannerList);
					}
				});
			},
			// 上传企业详情图
			addMsgImg() {
				let that = this;
				that.$util.uploadImageChange('upload/image', (res) => {
					if (res.status == 200) {
						that.qiyeDetailImgList = res.data.url
					}
				});
			},
			// 提交修改关于我们
			submitAbout() {
				deitAbout({
					enterprise_id: this.qiyeId,
					company_tel: this.aboutInfo.company_tel,
					company_address: this.aboutInfo.company_address
				}).then(res => {
					console.log(res)
					if (res.status == 200) {
						uni.showToast({
							title: "修改成功",
							icon: 'success'
						})
						setTimeout(() => {
							uni.navigateBack()
						}, 1000)
					}
				})
			},
			// 删除企业介绍图片
			deleteQiyeMsgImg(item, index) {
				this.qiyeDetailImgList = ""
			},
			// 删除企业轮播图
			deleteQiyeBanner(item, index) {
				this.qiyeBannerList.splice(index, 1)
			},
			// 确认修改企业介绍
			qiyeMsgBc() {
				deitQiyeMsg({
					enterprise_id: this.qiyeId,
					compang_banner: this.qiyeDetailImgList,
					company_images: this.qiyeBannerList,
					company_des: this.qiyeMsg
				}).then(res => {
					if (res.status == 200) {
						uni.showToast({
							title: "修改成功",
							icon: 'success'
						})
						setTimeout(() => {
							uni.navigateBack()
						}, 1000)
					}
				})
			},
			// 切换选中类型
			qiehuan(index) {
				this.showindex = index
				console.log(index);
			},
			changeIndicatorDots(e) {
				this.indicatorDots = !this.indicatorDots
			},
			changeAutoplay(e) {
				this.autoplay = !this.autoplay
			},
			intervalChange(e) {
				this.interval = e.target.value
			},
			durationChange(e) {
				this.duration = e.target.value
			},
			goRouter(item) {
				var pages = getCurrentPages();
				var page = (pages[pages.length - 1]).$page.fullPath;
				if (item.link == page) return
				if (item.link == '/pages/chat/chatGPT/chatGPT') {
					if (!this.isLogin) {
						uni.showToast({
							title: '请登录',
							icon: 'none'
						})
						setTimeout(() => {
							uni.navigateTo({
								url: '/pages/users/wechat_login/index'
							})
						}, 1000)
						return;
					}
				}
				uni.redirectTo({
					url: item.link,
					fail(err) {
						uni.navigateTo({
							url: item.link
						})
					}
				})
			},
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #fff;
		padding-bottom: 100rpx;
	}

	.gywm {
		padding: 32rpx 48rpx;

		.xinqtext {
			h3 {
				font-weight: 600;
				font-size: 32rpx;
				line-height: 40rpx;
				color: #161616;
				display: inline-block;
				vertical-align: middle;
			}

			span {
				margin-left: 16rpx;
				font-weight: 500;
				font-size: 24rpx;
				line-height: 40rpx;
				text-align: left;
				color: #e33c21;
				opacity: 0.2;
				vertical-align: middle;
			}
		}

		.ophone {
			margin-top: 40rpx;

			span {
				font-weight: 400;
				font-size: 24rpx;
				line-height: 40rpx;
				color: #a0a0a0;
			}

			.phflex {
				display: flex;
				justify-content: space-between;
				align-items: center;
				border-bottom: 1rpx solid #efefef;
				padding: 32rpx 0rpx;

				span {
					font-weight: 600;
					font-size: 28rpx;
					line-height: 40rpx;
					color: #161616;
				}

				div {
					padding: 0rpx 28rpx;
					border-left: 1rpx solid #efefef;

					image {
						width: 32rpx;
						height: 32rpx;
					}
				}

				input {
					width: 100%;
				}
			}
		}

		.lianxi {
			margin-top: 64rpx;

			h3 {
				text-align: center;
				font-weight: 600;
				font-size: 28rpx;
				line-height: 40rpx;
				color: #161616;
				margin-bottom: 4rpx;
			}

			>div {
				margin: auto;
				width: 58rpx;
				height: 4rpx;
				border-radius: 2rpx;
				background: #e33c21;
				margin-bottom: 32rpx;
			}

			p {
				font-weight: 400;
				font-size: 24rpx;
				line-height: 40rpx;
				color: #161616;
			}
		}

		.annui {

			margin: auto;
			width: 464rpx;
			height: 96rpx;
			border-radius: 48rpx;
			background: #e33c21;
			box-shadow: 0 12rpx 36rpx rgba(193, 0, 0, 0.1);
			font-weight: 600;
			font-size: 34rpx;
			line-height: 96rpx;
			text-align: center;
			color: #fff;
			margin-top: 80rpx;
		}

		.dibu {
			margin-top: 106rpx;
			display: block;
			text-align: center;
			font-weight: 400;
			font-size: 24rpx;
			line-height: 40rpx;
			color: #a1a1a1;
		}
	}

	.qiye {
		padding: 32rpx 48rpx;

		.onetou {
			.xinqtext {
				h3 {
					font-weight: 600;
					font-size: 32rpx;
					line-height: 40rpx;
					color: #161616;
					display: inline-block;
					vertical-align: middle;
				}

				span {
					margin-left: 16rpx;
					font-weight: 500;
					font-size: 24rpx;
					line-height: 40rpx;
					text-align: left;
					color: #e33c21;
					opacity: 0.2;
					vertical-align: middle;
				}
			}

			.odiver {
				display: grid;
				grid-template-columns: 1fr 1fr;
				column-gap: 16rpx;

				>div {
					margin: 16rpx 0rpx;
					width: 320rpx;
					height: 336rpx;
					box-shadow: 0 4rpx 8rpx rgba(4, 11, 20, 0.05);
					position: relative;

					video {
						width: 100%;
						height: 77%;
					}

					h3 {
						padding: 20rpx 24rpx;
						font-weight: 600;
						font-size: 28rpx;
						text-align: left;
						color: #161616;
					}

					text {
						font-size: 52rpx;
						border-radius: 100%;
						overflow: hidden;
						background-color: #fff;
						position: absolute;
						top: -10rpx;
						right: -10rpx;
					}
				}
			}

			.page {
				margin: 32rpx 0rpx;
				width: 100%;
				height: 400rpx;
				box-shadow: 0 4rpx 8rpx rgba(4, 11, 20, 0.05);
				position: relative;

				video {
					width: 100%;
					height: 77%;
				}

				h3 {
					padding: 20rpx 24rpx;
					font-weight: 600;
					font-size: 28rpx;
					text-align: left;
					color: #161616;
				}

				text {
					font-size: 52rpx;
					border-radius: 100%;
					overflow: hidden;
					background-color: #fff;
					position: absolute;
					top: -10rpx;
					right: -10rpx;
				}
			}
		}

		.button {
			display: flex;
			justify-content: center;

			.uploadVideo {
				background-color: #e33c21;
				color: white;
				width: 50%;
				text-align: center;
				font-size: 28rpx;
				padding: 15rpx 20rpx;
			}
		}
	}

	.ocanp {
		padding: 32rpx 48rpx;

		.xinqtext {
			h3 {
				font-weight: 600;
				font-size: 32rpx;
				line-height: 40rpx;
				color: #161616;
				display: inline-block;
				vertical-align: middle;
			}

			span {
				margin-left: 16rpx;
				font-weight: 500;
				font-size: 24rpx;
				line-height: 40rpx;
				text-align: left;
				color: #e33c21;
				opacity: 0.2;
				vertical-align: middle;
			}
		}

		.twoimg {
			padding: 32rpx 0rpx;
			width: 100%;
			height: 1640rpx;

			image {
				width: 100%;
				height: 100%;
			}
		}
	}

	.xianq {
		padding: 15rpx 48rpx;

		.xinqtext {
			h3 {
				font-weight: 600;
				font-size: 32rpx;
				line-height: 40rpx;
				color: #161616;
				display: inline-block;
				vertical-align: middle;
			}

			span {
				margin-left: 16rpx;
				font-weight: 500;
				font-size: 24rpx;
				line-height: 40rpx;
				text-align: left;
				color: #e33c21;
				opacity: 0.2;
				vertical-align: middle;
			}
		}

		.lintext {
			.poimg {
				margin: 32rpx 0rpx;
				width: 100%;
				height: 310rpx;
				border-radius: 15rpx;
				overflow: hidden;

				image {
					width: 100%;
					height: 100%;
				}
			}

			span {
				font-weight: 400;
				font-size: 28rpx;
				line-height: 44rpx;
				color: #161616;
			}

		}
	}

	.toubu {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 16rpx 50rpx;
		padding-top: 20rpx;
		background-color: #fff;

		.taber {
			text-align: center;

			image {
				width: 48rpx;
				height: 48rpx;
			}

			span {
				display: block;
				font-weight: 400;
				font-size: 20rpx;
				color: #161616;
			}

			.osanjia {
				margin: auto;
				margin-top: 8rpx;
				width: 0rpx;
				height: 0rpx;
				border: 8rpx solid transparent;
				border-top: 8rpx solid #E33C21;
			}

			.ersanjiao {
				margin: auto;
				margin-top: 8rpx;
				width: 0rpx;
				height: 0rpx;
				border: 8rpx solid transparent;
				border-top: 8rpx solid transparent;
			}
		}
	}

	.uni-margin-wrap {
		padding: 32rpx 48rpx;
		width: 690rpx;
		width: 100%;
	}

	.swiper {
		height: 300rpx;
	}

	.swiper-item {
		display: block;
		height: 300rpx;
		line-height: 300rpx;
		text-align: center;

		image {
			width: 100%;
			height: 100%;
		}
	}

	.swiper-list {
		margin-top: 40rpx;
		margin-bottom: 0;
	}

	.uni-common-mt {
		margin-top: 60rpx;
		position: relative;
	}

	.info {
		position: absolute;
		right: 20rpx;
	}

	.uni-padding-wrap {
		width: 550rpx;
		padding: 0 100rpx;
	}

	.qiyeMsgTitle {
		padding: 10rpx;
		font-size: 30rpx;
		font-weight: 600;
	}

	.qiyeMsgDetail {
		padding-bottom: 20rpx;

		textarea {
			border: 1rpx solid gainsboro;
			margin: 0 auto;
			height: 300rpx;
		}
	}

	.bottomButton {
		display: flex;
		justify-content: center;

		button {
			background-color: #e33c21;
			color: white;
			width: 50%;
			text-align: center;
			font-size: 28rpx;
			padding: 15rpx 20rpx;
		}
	}

	.diteQiyeBanner {
		display: grid;
		grid-template-columns: repeat(2, 49%);
		column-gap: 16rpx;
		padding: 10rpx;

		.diteQiyeBannerView {
			position: relative;

			image {
				width: 100%;
				height: 350rpx;
			}

			text {
				font-size: 52rpx;
				border-radius: 100%;
				overflow: hidden;
				background-color: #fff;
				position: absolute;
				top: -10rpx;
				right: -10rpx;
			}
		}

		.border {
			margin: 20rpx 15rpx;
			vertical-align: middle;
			border: 2rpx dashed #595959;
			display: flex;
			align-items: center;
			justify-content: center;
			margin-right: 10rpx;
			// width: 180rpx;
			// height: 180rpx;
			position: relative;

			view {
				display: flex;
				flex-wrap: wrap;
				text-align: center;

				text {
					width: 100%;
				}

				text:nth-of-type(1) {
					font-size: 100rpx;
				}
			}
		}
	}

	// tabbar样式
	.page-footer {
		position: fixed;
		bottom: 0;
		z-index: 30;
		display: flex;
		align-items: center;
		justify-content: space-around;
		width: 100%;
		height: calc(98rpx+ constant(safe-area-inset-bottom)); ///兼容 IOS<11.2/
		height: calc(98rpx + env(safe-area-inset-bottom)); ///兼容 IOS>11.2/
		box-sizing: border-box;
		border-top: solid 1rpx #F3F3F3;
		background-color: #fff;
		box-shadow: 0px 0px 17rpx 1rpx rgba(206, 206, 206, 0.32);
		padding-bottom: constant(safe-area-inset-bottom); ///兼容 IOS<11.2/
		padding-bottom: env(safe-area-inset-bottom); ///兼容 IOS>11.2/

		.foot-item {
			display: flex;
			width: max-content;
			align-items: center;
			justify-content: center;
			flex-direction: column;
			position: relative;

			.count-num {
				position: absolute;
				display: flex;
				justify-content: center;
				align-items: center;
				width: 40rpx;
				height: 40rpx;
				top: 0rpx;
				right: -15rpx;
				color: #fff;
				font-size: 20rpx;
				background-color: #FD502F;
				border-radius: 50%;
				padding: 4rpx;
			}
		}

		.foot-item image {
			height: 50rpx;
			width: 50rpx;
			text-align: center;
			margin: 0 auto;
		}

		.foot-item .txt {
			font-size: 24rpx;


			&.active {}
		}
	}

	// 推销热文样式
	.remeng {
		margin-top: 20rpx;
		background-color: #fff;
		border-radius: 8rpx;
		padding: 48rpx;

		p {
			font-weight: 600;
			font-size: 32rpx;
			text-align: left;
			color: #161616;
		}

		&>view {
			display: flex;
			align-items: center;
			margin-bottom: 20rpx;
		}

		.left {
			display: inline-block;

			image {
				width: 200rpx;
				height: 120rpx;
				border-radius: 20rpx;
			}
		}

		.right {
			&>view {
				margin: 10rpx 0;
			}

			display: inline-block;
			margin-left: 10px;
			width: 600rpx;

			.title {
				width: 100%;
				font-size: 32rpx;
				font-weight: 600;
			}

			.msg {
				font-size: 24rpx;
			}

			.tiem {
				width: 100%;
				font-size: 24rpx;
				color: gray;
				display: flex;
				justify-content: space-between;
			}
		}


		//      view {
		//           margin-top: 32rpx;
		//           display: flex;
		// 		  align-items: center;
		//           // align-items: center;

		//           div {
		//                width: 214rpx;
		//                // height: 144rpx;
		//                border-radius: 25rpx;
		//                overflow: hidden;
		//                margin-right: 20rpx;

		//                image {
		//                     width: 150rpx;
		//                     height: 150rpx;
		//                }
		//           }
		//           .ospntext {
		// 			   padding: 20rpx 0;
		//                font-weight: 600;
		//                font-size: 30rpx;
		//                text-align: left;
		//                color: #161616;
		//           }
		//      }
	}
</style>